<template>
  <div class="mod-config">
    <table-view ref="view"
                :searchAttrs="searchAttrs"
                :primaryKey="primaryKey"
                :listApiName="listApiName"
                :deleteApiName="deleteApiName"
                :exportApiName="exportApiName"
                :saveAuthName="saveAuthName"
                :deleteAuthName="deleteAuthName"
                :showPriceAuthName="showPriceAuthName"
                :templateDownloadApiName="templateDownloadApiName"
                :importApiName="importApiName"
                :printFunc='printFunc'
                :showAttrs="showAttrs"
                :multiAdd='true'
    >
    </table-view>
    <add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" @refreshDataList="getDataList"></add-or-update>
    <box-info-add-or-update v-if="boxInfoVisible" ref="boxInfo"></box-info-add-or-update>
  </div>
</template>

<script>
import tableView from '@/components/tableView'
import basicMixins from '@/utils/commonViewMixins'
import AddOrUpdate from './boxadd-add-or-update'
import BoxInfoAddOrUpdate from '@/views/modules/box/boxinfo-add-or-update'
import {digitUppercase} from '@/utils'

export default {
  mixins: [basicMixins],
  data() {
    return {
      primaryKey: 'id',
      listApiName: 'boxApi/listBoxAddList',
      deleteApiName: 'boxApi/deleteBoxAdd',
      exportApiName: 'boxApi/getBoxAddExport',
      saveAuthName: 'box:boxadd:save',
      deleteAuthName: 'box:boxadd:delete',
      showPriceAuthName: 'box:boxadd:price',
      templateDownloadApiName: 'boxApi/templateDownloadBoxAdd',
      importApiName: 'boxApi/importBoxAdd',
      searchAttrs: {
        boxNo: {
          placeholder:'纸箱编号',
        },
        boxFactoryId:{
          placeholder:'请选择纸箱厂',
          clearable: true,
          type: 'autoComplete',
          querySearchApiName: 'boxApi/getBoxFactoryList'
          //boxApi/getBoxFactoryList
        },
        dateTimeRange:{
          type: 'date',
          dateType: 'daterange',
          clearable: true
        }
      },
      showAttrs: {

        boxNo: {
          label: '纸箱编号',
          type: 'linkLabel',
          routerName: 'box-boxinfo',
          searchKey: 'boxNo'
        },

        // bodySize: {
        //   label: '纸箱尺寸'
        // },
        pieceNumber: {
          label: '每箱只数',
          type: 'tag'
        },
        boxNumber: {
          label: '纸箱数量',
        },
        // spacerAndParryNumber: {
        //   label: '格挡|垫片',
        //   width:100
        // },
        factoryName: {
          label: '纸箱厂'
        },

        // location: {
        //   label: '存放位置'
        // },
        tickerNo:{
          label: '入库单号'
        },
        boxSource:{
          label:'供应方式',
          type: 'radio',
          items: [
            {text: '采购', value: 0, tagType: 'success'},
            {text: '客供', value: 1, tagType: 'danger'}
          ]

        },
        boxPrice: {
          label: '单价(元)',
          type: 'priceStatus',
          // effect: 'light',
        },
        amount: {
          label: '金额(元)',
          type: 'priceStatus',
          // effect: 'light',
        },
        dayTime: {
          label: '日期',
          type: 'date'
        },

        orderDetailNo: {
          label: '订单编号'
        },


        remark: {
          label: '备注'
        },
        status: {
          label: '状态',
          type: 'radio',
          items: [
            {value: 0, text: '禁用', tagType: 'danger'},
            {value: 1, text: '正常'},
            {value: 2, text: '待确认',tagType: 'info'}
          ]
        }
      },
      boxInfoVisible: false
    }
  },
  methods: {
    openBoxInfoDialog(cb) {
      this.boxInfoVisible = true
      this.$nextTick(() => {
        if (!this.R.isNil(this.$refs.boxInfo)) {
          this.$refs.boxInfo.init(null, {status: 1}, cb)
        }
      })
    },
    printFunc(rows) {

      this.$vBus.$emit('SHOW_PRINT_DIALOG', (winBox) => {
        const tmpDocument = this.R.prop('document', winBox)

        const content = tmpDocument.querySelector('#contentBox')

        if (this.R.isNil(tmpDocument) || this.R.isNil(content)) {
          return
        }
        content.innerHTML = ''

        const addTd = (tr, str) => {
          const td = tmpDocument.createElement('td')

          td.innerText = str
          tr.appendChild(td)
        }
        const {dayTime} = rows[0]
        const {tickerNo} = rows[0]
        const {factoryName} = rows[0]
        const {boxSource} = rows[0]
        const {clientName} = rows[0]

        let sumAmount = 0

        tmpDocument.querySelector('#timeBox').innerHTML = dayTime.toString().substr(0,11)
        tmpDocument.querySelector('#tickerNoBox').innerHTML = tickerNo.toString()

        tmpDocument.querySelector('#supplierNameBox').innerHTML = boxSource===0?factoryName:clientName+"-客供"

        rows.forEach(row => {
          const {boxNo, bodySize, pieceNumber, boxNumber, boxPrice, amount,spacerAndParryNumber} = row

          const tr = tmpDocument.createElement('tr')

          addTd(tr, boxNo)
          addTd(tr, bodySize)
          addTd(tr, pieceNumber)

          addTd(tr, '套')
          addTd(tr, boxNumber)
          addTd(tr, boxPrice)
          addTd(tr, amount)
          addTd(tr, spacerAndParryNumber)

          sumAmount += amount
         content.appendChild(tr)
        })


        let transformSumAmount = sumAmount.toFixed(2)
        let sumAmountChinese=digitUppercase(transformSumAmount)

        tmpDocument.querySelector('#sumAmountBox').innerHTML = transformSumAmount
        tmpDocument.querySelector('#sumAmountChineseBox').innerHTML = sumAmountChinese

      }, true,'printBoxInStorage.html')
    },
  },
  components: {
    tableView,
    BoxInfoAddOrUpdate,
    AddOrUpdate
  }
}
</script>
